<%@ page language="java" pageEncoding="utf-8"%>
<%@taglib prefix="s" uri="/struts-tags"%>

<script type="text/javascript" src="${aier_js_url}lib/afu.js"></script>

<div class="top-bg">
	<img id="top-bg" src=""
		style="width: 100%;height: 100%">
	<div class="cover-setting">
		<a class="cover-setting-btn">封面设置</a>
		<!--  封面设置 -->
		<div class="window-el-cov-set" id="coverSetDialog" title="封面设置">
			<div class="navbar">
				<ul class="float-list clearfix">
					<li class="classic-cover-btn current"><a>经典封面</a></li>
					<li class="custom-cover-btn"><a>自定义</a></li>
				</ul>
			</div>
			<div class="box">

				<!-- 经典封面 -->
				<div class="classic-cover-box open">
					<div class="select-area">
						<ul class="float-list clearfix">
							<li id="tha_0"><a href="javascript:void(0);"
								onclick="coLitog('0')"> <img
									src="${classimg_get_url}small/0.jpg" alt=""> <span>回忆</span>
							</a></li>

							<li id="tha_1"><a href="javascript:void(0);"
								onclick="coLitog('1')"> <img
									src="${classimg_get_url}small/1.jpg" alt=""> <span>一个人</span>
							</a></li>

							<li id="tha_2"><a href="javascript:void(0);"
								onclick="coLitog('2')"> <img
									src="${classimg_get_url}small/2.jpg" alt=""> <span>童年</span>
							</a></li>

							<li id="tha_3"><a href="javascript:void(0);"
								onclick="coLitog('3')"> <img
									src="${classimg_get_url}small/3.jpg" alt=""> <span>水果暴动</span>
							</a></li>

						</ul>
					</div>

				</div>
				<!-- 自定义 -->
				<div class="custom-cover-box">
					<div class="picture-preview-area">
						<img class="area-img" alt=""
							src="${aier_img_url}temp/userCovers/1.png" style="display: none;">
						<div id="reselect" onclick="delfile();" class="select-btn"
							style="cursor: pointer;display: none;">重新选择</div>
						<input class="input_opacity" type="file" id="file" name="file">
						<label id="upPic" class="select-btn" style="cursor:pointer;"
							for="file"><a class="select-btn" id="b_selfile"
							href="javascript:;">点击上传图片 </a> </label>
					</div>
				</div>
			</div>
		</div>
		<script type="text/javascript">
			var tagId = 0;
			function openTag() {
				if ($(this).hasClass('current')) {
					//do nothing
				} else {
					$(this).addClass('current').nextAll()
							.removeClass('current');
					$(this).prevAll().removeClass('current');
					$('.custom-cover-box,.classic-cover-box').removeClass(
							'open');
				}
				;
				if ($('.classic-cover-btn').hasClass('current')) {
					tagId = 0;
					$('.classic-cover-box').addClass('open');
				} else {
					tagId = 1;
					$('.custom-cover-box').addClass('open');
				}

			};

			$('.classic-cover-btn,.custom-cover-btn').click(openTag);

			$('#coverSetDialog')
					.dialog(
							{
								//背景变暗
								modal : true,
								autoOpen : false,
								show : "fade",
								hide : "fade",
								width : "650",
								buttons : {
									"确定" : function() {
										if (0 == tagId) {
											var fun = function(data) {
												loadCovers();
												$('#coverSetDialog').dialog(
														"close");
											};
											exeAjax(
													ajaxUrl("${aier_url}${aier_urijs}ccomm_updateGivImgName${aier_suffix}"),
													fun, {
														"selCoId" : selCoId,
														"cid" : "${cid}"
													});

										} else if (1 == tagId) {

											var fun = function(data1) {
												loadCovers();
												$('#file').show();
												$('#upPic').show();
												$('.area-img').hide();
												$('#reselect').hide();
												$('#coverSetDialog').dialog(
														"close");
											};
											exeAjax(
													ajaxUrl("${aier_url}${aier_urijs}ccomm_updateSImgName${aier_suffix}"),
													fun, {
														"cid" : "${cid}",
														"img" : imgName
													});
										}
									},
									"取消" : function() {
										$(this).dialog("close");
									}
								}
							});

			$('.cover-setting-btn').click(function() {
				$('#coverSetDialog').dialog('open');
			});
		</script>
	</div>
</div>

<div class="class-info">
	<!-- 右侧信息 -->
	<div class="class-info-main">
		<div class="class-info-name">
			<span>${classes.cname}</span>
		</div>
		<div class="class-info-signature">班级宣言：${classes.manifesto}</div>
		<!-- 
		<div class="class-info-setting clearfix">
			<a class="btn-orange-2"> <span>关注</span> </a>
		</div> -->
	</div>

	<!-- 头像 -->
	<div class="class-avatar">
		<div class="avatar">
			<img src="${classlogo_get_url}big/${classes.clogo}" alt="">
			<div class="manage">
				<a class="btn btn-normal-orange" onclick="goclassM();"> <span>班级管理</span>
				</a>
			</div>
		</div>
		<!-- 粉丝关注微博数 -->
		<div class="class-avatar-bottom">
			<ul class="float-list clearfix">
				<li><a class="follow-num" href=""> <strong>${classes.num_teacher}</strong>
						<span>教师</span> </a>
				</li>
				<!--  <li><a class="fan-num" href=""> <strong>${classes.num_student}</strong>
						<span>学生</span> </a>
				</li>-->
				<li><a class="xxs-num" href=""> <strong>${classes.num_parent}</strong>
						<span>家长</span> </a>
				</li>
			</ul>
		</div>
	</div>


</div>


<script type="text/javascript">
	//进入班级管理页面 
	function goclassM() {
		var fun = function(data) {
			if (data.s == 1) {
				window.location.href = "${aier_url}${aier_uri}cbinfo_classesInfo.shtml?cid=${cid}&tid="
						+ data.tid;
			} else {
				$().message("您不是该班级的管理员,无权进入");
			}
		};
		exeAjax(
				ajaxUrl("${aier_url}${aier_urijs}classeshome_isClassAdmin${aier_suffix}"),
				fun, {
					"cid" : "${cid}"
				});
	}

	//上传学校封面

	// 上传文件
	function upfile() {
		var pName = $("#file").val().split("\\")[2];
		if (isnull(pName)) {
			$().message("请选择图片！");
			return;
		}
		var pname1 = pName.substring(pName.lastIndexOf('.')).toLowerCase();
		try {
			$
					.ajaxFileUpload({
						url : "${aier_url}${aier_urijs}ccomm_updateClassImg${aier_suffix}?cid=${cid}&photoName="
								+ pname1,
						secureuri : false,
						fileElementId : 'file',
						dataType : 'json',
						success : function(data, status) {

							if (!isnull(data.img)) {

								$('#file').hide();
								$('#upPic').hide();
								$('.area-img').show();
								$('#reselect').show();
								$('.area-img').attr("src","${classimg_get_url}origin/" + data.img);
								imgName = data.img;
							}
						},
						error : function(data, status, e) {
							$().message("服务器连接超时");
						}
					});
		} catch (e) {
			$().message("服务器连接超时");
		}
		;
	}
	var imgName = "";
	//删除图片
	function delfile() {
		var fun = function(data) {
			if (data.s == 1) {
				$('#file').show();
				$('#upPic').show();
				$('.area-img').hide();
				$('#reselect').hide();

				imgName = "";
			} else {
				$().message("删除失败，请稍后再试！");
			}
		};
		exeAjax(
				ajaxUrl("${aier_url}${aier_urijs}ccomm_deleteImage${aier_suffix}"),
				fun, {
					"photoName" : imgName
				});
	}

	$("#file").live('change', function() {
		upfile();
	});

	//读取封面
	function loadCovers() {
		var fun = function(data) {
			if (!isnull(data.img)) {

				$('#top-bg').attr("src", "${classimg_get_url}origin/" + data.img);
			} else {
				$('#top-bg').attr("src", "${classimg_get_url}origin/0.jpg");
			}

		};
		exeAjax(
				ajaxUrl("${aier_url}${aier_urijs}ccomm_serachClassimg${aier_suffix}"),
				fun, {
					cid : "${cid}"
				});

	}
	loadCovers();

	var selCoId;
	//选定默认封面
	function coLitog(id) {
		for ( var i = 0; i < 4; i++) {
			$("#tha_" + i).removeClass("liborder");
		}
		$("#tha_" + id).addClass("liborder");
		selCoId = id;
	}

	
</script>